<template>
  <el-dialog :title="titleMap[mode]" v-model="visible" :width="850"  destroy-on-close @closed="$emit('closed')">
    <el-descriptions column="1" border v-model="logDetail">
      <el-descriptions-item label="任务ID" >{{logDetail.id }}</el-descriptions-item>
      <el-descriptions-item label="任务分组" >{{logDetail.jobGroup }}</el-descriptions-item>
      <el-descriptions-item label="任务名称" >{{logDetail.jobName }}</el-descriptions-item>
      <el-descriptions-item label="调用字符串">{{logDetail.invokeTarget }}</el-descriptions-item>
      <el-descriptions-item label="日志消息" >{{logDetail.jobMessage }}</el-descriptions-item>
      <el-descriptions-item label="执行状态" >{{logDetail.status==1?'正常':'失败' }}</el-descriptions-item>
      <el-descriptions-item label="开始时间" >{{logDetail.startTime }}</el-descriptions-item>
      <el-descriptions-item label="结束时间" >{{logDetail.stopTime }}</el-descriptions-item>
      <el-descriptions-item label="异常信息" >
        <pre><code class="language-json">{{ logDetail.exceptionInfo }}</code></pre>
      </el-descriptions-item>
    </el-descriptions>
    <template #footer>
      <el-button @click="visible=false" >取 消</el-button>
    </template>
  </el-dialog>

  <el-dialog title="Cron表达式生成器" v-model="cronDialog">
    <crontab
      @hide="cronDialog = false"
      @fill="form.cronExpression = $event"
      :expression="form.cronExpression"
    ></crontab>
  </el-dialog>
</template>
<script>
import Crontab from '@renderer/components/Crontab/index.vue'
import Prism from 'prismjs';
import 'prism-themes/themes/prism-atom-dark.css';
export default {
  dicts:['system_global_taskgroup','system_misfire_policy','system_global_yesorno','system_task_status'],
  components:{
    Crontab,
  },
  computed: {
    id() {
      return id
    }
  },
  emits: ['success', 'closed'],
  data() {
    return {
      cronDialog: false,
      mode:'add',
      titleMap: {
        add: '新增',
        edit: '编辑',
        show: '调度日志详情'
      },
      visible: false,
      isSaveing: false,
      logDetail:{}
    }
  },

  methods: {
    //点击节点
    handleNodeClick(data,checked){
      if(checked){
        this.$refs.tree.setCheckedNodes([data])
      }
    },
    //显示
    open(mode='add'){
      this.mode = mode;
      this.visible = true;
      return this
    },
    //本地数据更新
    handleSaveSuccess(data, mode){
      if(mode =='show'){
        this.$refs.table.refresh()
        this.getData()
      }
    },
    //表单注入数据
    async setData(id){
      if(id){
        let res = await this.$API.monitor.logger.detail.get(id)
        console.log(11,res)
        this.logDetail = res.data
        this.$nextTick(() => {
          Prism.highlightAll(this.logDetail.exceptionInfo)
        })
      }

      //可以和上面一样单个注入，也可以像下面一样直接合并进去
      //Object.assign(this.form, data)
    }
  }
}
</script>

<style scoped>
.inline{
  display: inline-flex;
  vertical-align: middle;
  width: 50%;
}
</style>
